<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录页面</title>
    <script src="js/commen.js"></script>
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/login.css">
</head>

<body>
    <section id="login">
        <!-- 头部导航 -->
        <header class="top-nav">
            <div class="login-top">
                <a href="myinfo.html" class="top-nav1"><i></i></a>
                <p class="top-nav2">登录</p>
                <a href="register.html" class="top-nav3">注册</a>
            </div>
            
         
        </header>
        <!-- 登录详情 -->
        <section class="login-details">
            <form action="" method="POST">
            <!-- 登录名 -->
            <div class="login-name">
                <label>登录名</label>
                <input name="name" type="tell" placeholder="手机号码/用户名/邮箱" >
                <span><a href="javascript:void(0)" class="remove"></a></span>

            </div>
            <!-- 登录密码 -->
            <div class="login-password">
                <label>密码</label>
                <input name="password" type="password" placeholder="登录密码" class="psd">
                <span><a href="javascript:void(0)"></a></span>
            </div>
            <!-- 登录条 -->
            <div class="login-bar">
                <button class="btn">登录</button>

            </div>
        </form>
            <!-- 登录问题 -->
            <div class="login-issue">
                <a href="#">登录遇到问题？</a>
                <a href="#">境外手机登录</a>
        

            </div>
            <!-- 其他登录方式 -->
            <div class="login-log">

                <a href="#" class="login-log-wx"><i></i> </a>
                <a href="#" class="login-log-qq"><i></i> </a>
                <a href="#" class="login-log-zfb"><i></i> </a>
                <a href="#" class="login-log-wb"><i></i> </a>
                <a href="#" class="login-log-bd"><i></i> </a>

            </div>
        </section>

    </section>
    <script src="js/zepto.js"></script>
    <script src="js/touch.min.js"></script>
    <script>
           var event = "onclick" in window ? "click" : "tap";
           var ispaw=true;
        $(".login-password span").on(event,function(){
            if(ispaw){
                  $(".psd").attr("type", "text");
                  ispaw=false;
            }else{
               $(".psd").attr("type", "password");  
                 ispaw = true;
            }
          
        })
          $(".remove").on(event, function () {
                $(this).parent().prev().val("");
            });
    </script>
</body>

</html>